<template>
  <a-drawer
    :title="title"
    :visible="visible"
    width="90%"
    @close="
      () => {
        this.visible = false
      }
    "
  >
    <a-form-model ref="form" :model="entity" :rules="rules" v-bind="layout">
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="客户编码">
            <a-input v-model="entity.cCusCode" autocomplete="off" disabled placeholder="客户编码"/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="客户名称" prop="cCusName">
            <a-input v-model="entity.cCusName" :disabled="title == '审核'" autocomplete="off" placeholder="客户名称"/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="客户简称" prop="cCusAbbName">
            <a-input
              v-model="entity.cCusAbbName"
              :disabled="title == '审核'"
              autocomplete="off"
              placeholder="客户简称"
            />
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="公司正式名称 " prop="cCusPhone">
            <a-input
              v-model="entity.ONOfCompany"
              :disabled="title == '审核'"
              autocomplete="off"
              placeholder="公司正式名称"
            />
          </a-form-model-item>
        </a-col>

        <a-col :span="8">
          <a-form-model-item label="行业分类 " prop="cTrade">
            <a-input v-model="entity.cTrade" :disabled="title == '审核'" autocomplete="off" placeholder="行业分类 "/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="销售性质" prop="cTrade">
            <a-select
              v-model="entity.SaleType"
              :disabled="title == '审核'"
              allowClear
              placeholder="销售性质"
              style="width: 100%"
            >
              <a-select-option v-for="item in SaleType" :key="item.Id" :value="item.DicName">
                {{ item.DicName }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="上级单位">
            <CustRemoteSearchByCondition
              v-model="entity.ParentId"
              :disabled="title == '审核'"
              :is-my-data="false"
              mode="default"
              placeholder="检索客户(名称/编号)(省市区名称禁止查询)"
              @BindCustomer="BindCustomer">
            </CustRemoteSearchByCondition>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="客户类型">
            <a-select v-model="entity.cCusType" allowClear disabled placeholder="客户类型">
              <a-select-option :value="-1"> 备案客户</a-select-option>
              <a-select-option :value="0"> 潜在客户</a-select-option>
              <a-select-option :value="1"> 正式客户</a-select-option>
              <a-select-option :value="2"> 休眠客户</a-select-option>
              <a-select-option :value="3"> 待转正</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="客户来源" prop="CustomerOrigin">
            <a-select
              v-model="entity.CustomerOrigin"
              :disabled="title == '审核'"
              allowClear
              placeholder="客户来源"
              style="width: 100%">
              <a-select-option v-for="item in CustSource" :key="item.Id" :value="item.DicName">
                {{ item.DicName }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>

      </a-row>
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="省/直辖市" prop="cProvince">
            <a-select
              v-model="entity.cProvince"
              :disabled="title == '审核'"
              allowClear
              default-value="省/直辖市"
              style="width: 100%"
              @change="city($event)"
            >
              <a-select-option v-for="(item, dei) in list" :key="item.Id" :disabled="title == '审核'" :value="item.Id">
                {{ item.Name }}
              </a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="市" prop="cCity">
            <a-select
              v-model="entity.cCity"
              :disabled="title == '审核'"
              allowClear
              default-value="市"
              style="width: 100%"
              @change="village($event)"
            >
              <a-select-option v-for="(item, dei) in listChildren" :key="item.Id" :value="item.Id">
                {{ item.Name }}
              </a-select-option
              >
            </a-select>
          </a-form-model-item>
        </a-col>

        <a-col :span="8">
          <a-form-model-item label="区县" prop="cCounty">
            <a-select
              v-model="entity.cCounty"
              :disabled="title == '审核'"
              allowClear
              default-value="选择县级"
              style="width: 100%"
            >
              <a-select-option v-for="(item, dei) in county" :key="item.Id" :value="item.Id"> {{ item.Name }}</a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="银行账号" prop="cCusAccount">
            <a-input v-model="entity.cCusAccount" :disabled="title == '审核'" autocomplete="off"/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="开户银行" prop="cCusBank">
            <a-input v-model="entity.cCusBank" :disabled="title == '审核'" autocomplete="off" placeholder="开户银行"/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="应收余额" prop="iARMoney">
            <a-input-number v-model="entity.iARMoney" :disabled="title == '审核'" autocomplete="off" placeholder="应收余额" precision="2" style="width: 100%"/>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="法人" prop="cCusLPerson">
            <a-input v-model="entity.cCusLPerson" :disabled="title == '审核'" autocomplete="off" placeholder="法人"/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="营业执照 " prop="cCusRegCode">
            <a-input
              v-model="entity.cCusRegCode"
              :disabled="title == '审核'"
              autocomplete="off"
              placeholder="营业执照号码"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="余额初始日期 " prop="dLastDate">
            <a-date-picker v-model="entity.dLastDate" :disabled="title == '审核'" format="YYYY-MM-DD" style="width: 100%"/>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="8">
          <a-form-model-item label="手机号" prop="cCusPhone">
            <a-input v-model="entity.cCusPhone" :disabled="title == '审核'" autocomplete="off" placeholder="手机号"/>
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="开票要求" prop="IRInfo">
            <a-textarea
              v-model="entity.IRInfo"
              :auto-size="{ minRows: 5 }"
              :disabled="title == '审核'"
              autocomplete="off"
            />
          </a-form-model-item>
        </a-col>
        <a-col :span="8">
          <a-form-model-item label="地址" prop="cCusAddress">
            <a-textarea
              v-model="entity.cCusAddress"
              :auto-size="{ minRows: 5 }"
              :disabled="title == '审核'"
              autocomplete="off"
            />
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
    <div
      :style="{
        position: 'absolute',
        right: 0,
        bottom: 0,
        width: '100%',
        borderTop: '1px solid #e9e9e9',
        padding: '10px 16px',
        background: '#fff',
        textAlign: 'right',
        zIndex: 1,
      }"
    >
      <a-button @click="close">取消</a-button>&nbsp;
      <a-button v-if="title == '审核'" type="primary" @click="apply(true)">通过</a-button>&nbsp;
      <a-button v-if="title == '审核'" type="danger" @click="apply(false)">驳回</a-button>
      <a-button v-if="title !== '审核'" type="primary" @click="handleSubmit">保存</a-button>
    </div>
  </a-drawer>
</template>

<script>
import UserSample from '@/components/UserSample/List'
import CustRemoteSearchByCondition from '@/components/RemoteSearch/CustRemoteSearchByCondition'
import moment from 'moment'
import OperatorCache from '@/utils/cache/OperatorCache'

export default {
  components: {
    UserSample,
    CustRemoteSearchByCondition
  },
  props: {
    parentObj: Object
  },
  data () {
    return {
      layout: {
        labelCol: { span: 5 },
        wrapperCol: { span: 18 }
      },
      list: [], // 省级
      SaleType: [],
      CustSource: [], // 客户来源
      listChildren: [], // 市
      county: [], // 县
      visible: false,
      loading: false,
      entity: {},
      rules: {
        cProvince: [{ required: true, message: '未输入', trigger: 'blur' }],
        cCity: [{ required: true, message: '未输入', trigger: 'blur' }],
        // cCounty: [{ required: true, message: '未输入', trigger: 'blur' }],
        cCusName: [{ required: true, message: '未输入', trigger: 'blur' }],
        cCusType: [{ required: true, message: '未输入', trigger: 'change' }]
      },
      title: '',
      applyRecord: {},
      page: null
    }
  },
  mounted () {
    this.getlist()
  },
  methods: {
    apply (bl) {
      const title = `确认${bl ? '通过' : '驳回'}客户${
        this.applyRecord.Type == '1'
          ? '转正'
          : this.applyRecord.Type == '2'
            ? '分配到' + this.applyRecord.GroupName + '组'
            : '备案'
      }吗?`

      this.$confirm({
        title,
        onOk: () => {
          this.applyRecord.ApprovalStatus = bl ? 1 : 2
          this.$http.post('/CustomerManagement/Cust_CustomerApply/ApprovalAction', this.applyRecord).then((res) => {
            if (res.Success) {
              this.$message.success('操作成功')
              this.parentObj.getDataList()
              this.visible = false
            } else {
              this.$message.error(res.Msg)
            }
          })
        }
      })
    },
    AddRecord (obj) {
      this.$http.post('/CustomerManagement/Cust_CustomerApply/SaveData', obj).then((res) => {
        if (res.Success) {
        } else {
          this.$message.error(res.Msg)
        }
      })
    },
    BindCustomer (val) {
      this.$set(this.entity, 'ParentName', val == null ? null : val.cCusName)
      this.$set(this.entity, 'ParentId', val == null ? null : val.Id)
    },
    op () {
      return OperatorCache.info
    },
    getSelsct () {
      this.$http
        .post('/Base_BasicData/Base_DictionaryMain/GetTheDataByDicKey', {
          Condition: 'DicKey',
          Keyword: 'SaleType'
        })
        .then((res) => {
          this.SaleType = res.Data.DictionaryDetailsList
        })
    },
    getCustSource () {
      this.$http
        .post('/Base_BasicData/Base_DictionaryMain/GetTheDataByDicKey', {
          Condition: 'DicKey',
          Keyword: 'CustSource'
        })
        .then((res) => {
          this.CustSource = res.Data.DictionaryDetailsList
        })
    },
    CustomerChange (a) {
      this.$set(this.entity, 'ParentId', a.cCusCode)
      this.$set(this.entity, 'CustomerName', a.cCusName)
    },
    init () {
      this.visible = true
      this.entity = {}
      this.getCustSource()
      this.getSelsct()
      this.$nextTick(() => {
        this.$refs['form'].clearValidate()
      })
    },
    openForm (id, title, applyRecord, page) {
      this.page = page
      this.init()
      this.title = title
      this.entity.cCusType = -1
      // 审核数据
      if (applyRecord) {
        this.applyRecord = applyRecord
      }
      if (id) {
        this.loading = true
        this.$http.post('/CustomerManagement/CustomerInfo/GetTheData', { id: id }).then((resJson) => {
          this.loading = false
          this.entity = resJson.Data
          this.city(this.entity.cProvince)
          this.village(this.entity.cCity)
          if (this.entity['dCusDevDate']) {
            this.entity['dCusDevDate'] = moment(this.entity['dCusDevDate'])
          }
          if (this.entity['dLastDate']) {
            this.entity['dLastDate'] = moment(this.entity['dLastDate'])
          }
        })
      }
    },
    close () {
      this.visible = false
      this.entity = {}
    },
    // 市级change
    city (e) {
      this.$http.post('/Base_BasicData/Base_District/GetDataListByPId?pId=' + e, {}).then((resJson) => {
        this.loading = false
        this.listChildren = resJson.Data
      })
    },
    // 县change
    village (e) {
      this.$http.post('/Base_BasicData/Base_District/GetDataListByPId?pId=' + e, {}).then((resJson) => {
        this.loading = false
        this.county = resJson.Data
      })
    },
    // 获取省份信息
    getlist (e) {
      this.$http.post('/Base_BasicData/Base_District/GetDataListByPId?pId=0', {}).then((resJson) => {
        this.loading = false
        this.list = resJson.Data
      })
    },
    handleSubmit () {
      this.$refs['form'].validate((valid) => {
        if (!valid) {
          return
        }
        this.loading = true
        this.$http.post('/CustomerManagement/CustomerInfo/SaveData', this.entity).then((resJson) => {
          this.loading = false
          if (resJson.Success) {
            this.$message.success('操作成功!')
            this.visible = false
            this.applyRecord = resJson.Data
            if (this.entity.Id == null || this.entity.Id == undefined) {
              const obj = {
                CustomerId: resJson.Data.Id,
                CustomerName: resJson.Data.cCusName,
                Id: null,
                SalesmanId: this.op().Id,
                SalesmanName: this.op().RealName,
                ApprovalStatus: 0,
                ApplyDate: new Date(),
                Type: '3'
              }
              this.AddRecord(obj)
            }
            this.parentObj.getDataList()
          } else {
            this.$message.error(resJson.Msg)
          }
        })
      })
    }
  }
}
</script>
